<template>
    <div class="redactOrganization public">
				<el-breadcrumb separator=">" class="crumbs">
					<el-breadcrumb-item :to="{ path: '/organization'}">机构列表</el-breadcrumb-item>
					<el-breadcrumb-item :to="{ path: '/redactOrganization'}">编辑列表信息</el-breadcrumb-item>
				</el-breadcrumb>
				<el-row  :gutter="20">
      <el-col :span="4">&emsp;</el-col>
      <el-col :span="16">
          <el-col :span="8" class="redactOrg redactOrgText">上级组织</el-col><el-col class="redactOrg" :span="16">
				<el-select disabled v-model="supOrganization" placeholder="请选择" class="selectBox">
					<!-- 万一有bug  删除 -->
					<el-option key="1":label="'无'" :value="1"></el-option>
					<el-option v-for="item in supOrganizations" :key="item.value":label="item.name" :value="item.id"></el-option>
				</el-select>
			</el-col>
          <el-col :span="8" class="redactOrg redactOrgText">组织编码</el-col><el-col class="redactOrg" :span="16"><el-input disabled v-model="code"></el-input></el-col>          
          <el-col :span="8" class="redactOrg redactOrgText">组织名称</el-col><el-col class="redactOrg" :span="16"><el-input placeholder="请输入内容" v-model="name"></el-input></el-col>
          <el-col :span="8" class="redactOrg redactOrgText">所属区域</el-col>
          <el-col :span="16"  class="redactOrg">
			<el-select v-model="areaCode" placeholder="请选择" class="selectBox">
				<el-option v-for="item in areas":key="item.name":label="item.name":value="item.code"></el-option>
			</el-select>
          </el-col>
          
      </el-col>
      <el-col :span="4">&emsp;</el-col>
		</el-row>
		<!-- 保存 -->
		<el-row class="addUserBtn">
				<el-col :sm="9" :xs="6">&emsp;</el-col>
				<el-col :sm="3" :xs="6"><el-button type="primary" @click="save">保存</el-button></el-col>
				<el-col :sm="3" :xs="6"><el-button @click='cancelSave'>取消</el-button></el-col>
				<el-col :sm="9" :xs="6">&emsp;</el-col>
			</el-row>
		</div>
</template>
<script>
export default {
  name: "redactOrganization",
  data() {
    return {
      pid:null,
      areas: [],
      areaCode: "",
      supOrganizations: [],
      supOrganization: "",
      name: "",
      code: ""
    };
  },
  methods: {
    save() {
      
      for (let i = 0, j = this.areas.length; i < j; i++) {
        if (this.areaCode == this.areas[i].name) {
          this.areaCode = this.areas[i].code;
        }
      }
      var params = {
        pid: this.supOrganization,
        name: this.name,
        areaCode: this.areaCode
      };
      if (!params.pid || !params.name || !params.areaCode) {
        this.$message({
          type: "warning",
          message: "请填写完整信息",
          duration: 1500,
          showClose: true
        });
        return;
	  }
	  let loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      $.post(
        this._path + "/organizations/" + this.$route.query.id,
        params,
        res => {
			loading.close()
          if ("SUCCESS" == res.code) {
            this.$message({
              type: "success",
              message: "修改成功",
              duration: 1500,
              showClose: true
            });
            this.$router.push("/organization");
          } else {
            this.requestError(res,this)
          }
        }
      );
    },
    cancelSave() {
      window.history.go(-1);
    }
  },
  beforeCreate() {
    // 请求所属区域的代码
    this.$http.get(this._path + "/areas").then(res => {
      if(res.data.code == 'SUCCESS'){
        this.areas = res.data.data.areas;
      }else{
        this.requestError(res,this)
      }
      
    });
    // 上级组织
    this.$http.get(this._path + "/organizations").then(res => {
      if(res.data.code == 'SUCCESS'){
        this.supOrganizations = res.data.data.organizations;
      }else{
        this.requestError(res,this)
      }
    });
    $.get(this._path + "/organizations/" + this.$route.query.id, {}, res => {
      if(res.code == 'SUCCESS'){
        this.name = res.data.organization.name;
        this.code = res.data.organization.code;
        this.supOrganization = res.data.organization.pid * 1;
        this.pid = res.data.organization.pid
        this.areaCode = res.data.organization.area.name;
      }else{
        this.requestError(res,this)
      }
    });
  }
};
</script>

<style scoped lang="scss">
@import "./../style/public.scss";
@import "./../style/redactOrganization.scss";
</style>